<template>
  <div>
    <el-form-item label="自动轮播">
      <el-switch v-model="value.autoplay" active-color="#13ce66"></el-switch>
    </el-form-item>
    <el-form-item label="轮播间隔">
      <el-input size="small" v-model.number="rotationInterval" @change="changeInterval" :disabled="!value.autoplay"></el-input>
    </el-form-item>
    <el-form-item label="图片配置">
    </el-form-item>
  </div>
</template>

<script>
export default {
  name: "RotationChartConfig",
  components: {},
  props:{
    value:{
      type: Object,
      default: ()=>{
        return {}
      }
    }
  },
  data() {
    return {
      rotationInterval: this.value.interval
    }
  },
  watch:{
    value: {
      handler(val){
        console.log('监听变化')
        this.rotationInterval = this.value.interval;
      },
      deep: true,
    },
  },
  methods: {
    /**
     * 修改轮播间隔
    */
    changeInterval(value){
     this.value.interval = this.rotationInterval;
    }
  }
}
</script>

<style lang="less" scoped>
/deep/ .el-form-item__label{
  padding: 0 12px 0 0;
}
</style>
